<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .d1 {
            height: 1200px;
            width: 100px;
            border: 1px solid #000;
        }
    </style>
</head>

<body>
    <script>
        // // 1.防抖
        // let timer = null
        // function debounce() {
        //     clearTimeout(timer)
        //     timer = null
        //     timer = setTimeout(() => {
        //         console.log('防抖')
        //     }, 500)

        // }
        // window.addEventListener('scroll', debounce)
        // 2.节流
        let timer = null
        function thorttle() {
            if (!timer) {
                timer = setTimeout(() => {
                    console.log('节流')
                    clearTimeout(timer)
                    timer = null
                }, 1000)
            }

        }
        window.addEventListener('scroll', thorttle)


    </script>
    <div class="d1"></div>
</body>

</html>